<?php $this->load->view('admin/public/head.html'); ?>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper" ng-controller="admin-stream-group-controller">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            直播空间管理
            <small>设置直播空间</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 后台首页</a></li>
            <li class="active">直播空间</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">

            <div class="col-md-12">
                <!-- Horizontal Form -->
                <div class="box">
                    <div class="box-header with-border">
                        <h3 class="box-title">创建分组</h3>
                    </div>
                    <form class="form-horizontal">
                        <div class="box-body">
                            <div class="form-group">
                                <label for="groupName" class="col-sm-2 control-label">分组名称</label>

                                <div class="col-sm-6">
                                    <input type="text" class="form-control" ng-model="addGroupName" id="groupName" placeholder="分组名称">
                                    <p class="help-block">对设备进行分组, 便于更好管理直播设备</p>
                                </div>
                                <div class="col-sm-2">
                                    <button type="submit" class="btn btn-info" ng-click="addGroup()">添加分组</button>
                                </div>
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </form>
                </div>
                <!-- /.box -->
            </div>

            <div class="col-md-12">
                <div class="box">
                    <div class="box-header with-border">
                        <h3 class="box-title">分组列表</h3>
                        <div class="box-tools">

                        </div>
                    </div>
                    <!-- /.box-header -->
                    <div class="box-body">
                        <table class="table table-bordered">
                            <tr>
                                <th class="text-center" style="width: 40px">#</th>
                                <th>组名</th>
                                <th class="text-center">设备数量</th>
                                <th class="text-center" style="width: 80px">操作</th>
                            </tr>
                            <tr ng-show="groupLists.length" ng-repeat="($index, g) in groupLists">
                                <td class="text-center" ng-bind="g.id">

                                </td>
                                <td ng-bind="g.groupName"></td>
                                <td class="text-center" ng-bind="g.deviceNum"></td>
                                <td class="text-center">
                                    <a class="btn btn-flat btn-xs" ng-class="{'btn-default': g.groupName == '默认', 'btn-info': g.groupName != '默认'}" href="javascript:;" ng-click="editName($index, g.id)"><i class="fa fa-pencil"></i></a>
                                    &nbsp;
                                    <a class="btn btn-flat btn-xs" ng-class="{'btn-danger': g.deviceNum == 0 && g.groupName != '默认', 'btn-default': g.deviceNum > 0 || g.groupName == '默认'}" href="javascript:;" ng-click="delete($index, g.id)"><i class="fa fa-trash"></i></a>
                                </td>
                            </tr>
                            <tr ng-if="groupLists.length == 0">
                                <td colspan="4">
                                    <p class="help-block text-center">暂无数据</p>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>

        </div>
    </section>
    <!-- /.content -->
    <div class="modal fade" id="editModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">修改分组</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label for="editGroupName" class="col-sm-2 control-label">分组名称</label>
                            <div class="col-sm-8">
                                <input type="text" class="form-control" ng-model="edit.groupName" id="editGroupName" placeholder="分组名称">
                            </div>
                        </div>
                        <!-- /.box-body -->
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" ng-click="doEditGroupName()">设置</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
</div>
<!-- /.content-wrapper -->
<?php $this->load->view('admin/public/foot.html', array('js' => array(
    '/assets/admin/js/stream/group.js'
))); ?>
